<template>
    <admin-view>
        <admin-section>
            <AdminCard>
                <el-button type="text" @click="onAddVersion">添加版本</el-button>
            </AdminCard>
        </admin-section>
        <admin-section>

            <admin-card>

                    <el-table
                            :data="clubs.items"
                    >
                        <el-table-column
                                label="版本号"
                                prop="version"
                        >
                        </el-table-column>
                        <el-table-column
                                label="MD5"
                                prop="md5"
                        ></el-table-column>
                        <el-table-column
                                label="大小"
                                prop="size"
                        >
                            <template slot-scope="club">
                                {{club.row.size | Size}}
                            </template>
                        </el-table-column>
                        <el-table-column
                                label="强制更新"
                                prop="auto_update"
                        >
                            <template slot-scope="club">

                                <el-switch
                                        v-model="club.row.auto_update"
                                        disabled>
                                </el-switch>
                            </template>

                        </el-table-column>
                        <el-table-column
                                label="创建时间"
                                prop="apk"
                        >
                            <template slot-scope="club">
                                {{club.row.create_time | TimeFormat}}
                            </template>
                        </el-table-column>
                        <el-table-column
                                label="操作"
                        >
                            <template slot-scope="club">
                                <el-button
                                        v-if="club.row.selected === false"
                                        type="text"
                                        size="mini"
                                        @click="onApply(club.row.version)">升级到该版本</el-button>
                                <span class="current-version" v-else>
                                    当前版本
                                </span>

                                <el-button
                                        type="text"
                                        size="mini"
                                        @click="onDownload(club.row.apk)">下载文件</el-button>
                            </template>
                        </el-table-column>
                    </el-table>

            </admin-card>
        </admin-section>
    </admin-view>
</template>

<script lang="ts">

    import {AdminView,AdminCard,AdminLabel,AdminSection} from '@/views/layout'
    import {Vue,Component} from 'vue-property-decorator'
    import {Api} from '@/api/meta'
    import Filter from '@/libs/filter'

    @Component({
        name:"AdminVersionList",
        components: {
            AdminView,
            AdminCard,
            AdminSection
        },
        filters: Filter
    })
    export default class AdminVersionList extends Vue {

        status:any = "全部";
        applyStatus = [
            "未提交",
            "待审核",
            "审核通过",
            "审核拒绝",
            "不存在",
        ];

        clubs:Api.Meta.GetVersionListResponse = {
            items :[]
        };


        onAddVersion() {
            this.$router.push({
                path:'/config/version/add'
            })
        }
        loadView() {


            Api.Meta.GetVersionList({}).then((ack) => {
                console.log(ack);
                this.clubs = ack
            })
        }

        onStatusChange() {
            this.loadView()
        }

        mounted() {
            this.loadView()
        }

        onDownload(url:any) {
            window.open(url)
        }

        onApply(version:any) {

            Api.Meta.SetVersion({version:version})
                .then((ack) => {
                    this.$message({
                        type:"success",
                        message:`提交成功.`
                    });

                    this.loadView()
                })
        }
    }


</script>

<style lang="scss" scoped>

    .current-version {
        color: #67C23A;
    }

    .foot {
        padding-top: 10px;
    }
</style>